<%@ taglib uri="/struts-tags" prefix="s"%>

<script>

	$(function() {
			
		$( ".button" ).button();				
		$(".formtb tr:odd").addClass("odd");
		$(".formtb tr:even").addClass("even");
		
	});
</script> 

<script type="text/javascript">
	var oTableExistencia;

	$(function() {
		
		oTableExistencia = $('#tbBusquedaArticulos').dataTable({
			"bJQueryUI": true,
			"sPaginationType" : "full_numbers",
			"bFilter" : false,
			"bProcessing": true,
			"fnDrawCallback": function(oSettings){
			  $('table#tbBusquedaArticulos td').bind('mouseenter', function () {
				   $(this).parent().children().each(function(){$(this).addClass('datatablerowhighlight');}); });
			  $('table#tbBusquedaArticulos td').bind('mouseleave', function () { 
			  	   $(this).parent().children().each(function(){$(this).removeClass('datatablerowhighlight');}); });
				   
			},
			"sAjaxSource": null,
			"aoColumns" : 
				[ 
				{"mData" : "codigoArticulo"}, 
				{"mData" : "descripArticulo"},
				{"mData" : "precio"}, 
				{"mData" : "existencia"}
				]
		
		});
		
		$('#tbBusquedaArticulos tbody tr').live('click', function(e) {
			
			if ($(this).hasClass('row_selected')) {
				$(this).removeClass('row_selected');
			} else {
				oTableExistencia.$('tr.row_selected').removeClass('row_selected');
				$(this).addClass('row_selected');
			}
			
			var nTds = $('td', this);
			var id = $(nTds[0]).text();
			var descrip = $(nTds[1]).text();
			$("#h_codigoArticulo").val(id);
			$("#h_descripArticulo").val(descrip);
			$("#h_precioVenta").val($(nTds[2]).text());
			$("#h_existencia").val($(nTds[3]).text());
			
			//alert(id);
		});
		
	});

	function buscarExistencias(){
		
		parametros = {
				"nombre": $('#nombre').val()
			 };
		
	
		$.getJSON("/SolucionPresentacionWeb/movimientos/buscar-existencia.action", parametros, function(json){
			var oSettings = oTableExistencia.fnSettings();
			oTableExistencia.fnClearTable(this);
		    for (var i=0; i<json.aaData.length; i++)
		    {
		    	oTableExistencia.oApi._fnAddData(oSettings, json.aaData[i]);
		    }
		    oSettings.aiDisplay = oSettings.aiDisplayMaster.slice();
		    oTableExistencia.fnDraw();
		});

	}
	
</script>

		<s:form theme="simple">

			<table width="100%" border="0" cellspacing="1" cellpadding="3"
				class="formtb" bgcolor="#bcb9a7">
				<tr>
					<td colspan="2"><strong>Filtrado</strong></td>
				</tr>
				<tr>
					<td width="21%">Nombre Articulo</td>
					<td width="79%"><s:textfield name="nombre"
							id="nombre" size="70"/></td>
				</tr>
				
				<tr>
					<td>&nbsp;</td>
					<td><input type="button" value="Buscar Articulo" class="button" onclick="buscarExistencias()" />
					</td>
				</tr>

				<tr>
				<td colspan="2">
				<s:hidden name="h_codigoArticulo" id="h_codigoArticulo" />
				<s:hidden name="h_descripArticulo" id="h_descripArticulo" />
				<s:hidden name="h_precioVenta" id="h_precioVenta" />
				<s:hidden name="h_existencia" id="h_existencia" />
				<input type="button" id="btnSeleccionarExistencia" value="Seleccionar" class="button" />
					
				</td>
				</tr>
				<tr>
					<td colspan="2"><table cellpadding="0" cellspacing="0"
							border="0" class="display" id="tbBusquedaArticulos">
							<thead>
								<tr>
									<th>Codigo Articulo</th>
									<th>Nombre Articulo</th>
									<th>Precio Venta</th>
									<th>Existencia actual</th>
								</tr>
							</thead>
							<tbody>

							</tbody>
							<tfoot>
								<tr>
									<th>Codigo Articulo</th>
									<th>Nombre Articulo</th>
									<th>Precio Venta</th>
									<th>Existencia actual</th>
								</tr>
							</tfoot>
						</table></td>
				</tr>

			</table>
		</s:form>


